﻿<UserControl x:Class="Holdem.Core.Controls.CircularProgressBar" 
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:local="clr-namespace:Holdem.Core.Controls" 
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             FontFamily="{StaticResource PhoneFontFamilyNormal}"
             FontSize="{StaticResource PhoneFontSizeNormal}"
             Foreground="{StaticResource PhoneForegroundBrush}"
             mc:Ignorable="d">
    <UserControl.Resources>

      <Style x:Key="CircularProgressBarStyle" TargetType="ProgressBar">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ProgressBar">
                        <Grid x:Name="LayoutRoot">
                            <!--  attach the view model  -->
                            <local:CircularProgressBarViewModel.Attach>
                                <local:CircularProgressBarViewModel HoleSizeFactor="0.75" />
                            </local:CircularProgressBarViewModel.Attach>


                            <Ellipse Width="{Binding Diameter}"
                                     Height="{Binding Diameter}"
                                     HorizontalAlignment="Center" VerticalAlignment="Center"
                                     Fill="Transparent" Opacity="0.5"
                                     Stroke="LightGray" StrokeThickness="10" />

                            <local:PiePiece CentreX="{Binding CentreX}"
                                            CentreY="{Binding CentreY}"
                                            Fill="Black"
                                            InnerRadius="{Binding InnerRadius}"
                                            Opacity="0.7"
                                            Radius="{Binding Radius}"
                                            RotationAngle="0"
                                            WedgeAngle="{Binding Angle}" />

                            <Grid local:GridUtils.ColumnDefinitions="*,2*,*" local:GridUtils.RowDefinitions="*,2*,*">
                                <Viewbox Grid.Row="1" Grid.Column="1">
                                    <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center"
                                               FontWeight="Bold" Foreground="Black"
                                               Text="{Binding Percent,
                                                              StringFormat=0%}" />
                                </Viewbox>
                            </Grid>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="PieProgressBarStyle" TargetType="ProgressBar">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ProgressBar">
                        <Grid x:Name="LayoutRoot">
                            <!--  attach the view model  -->
                            <local:CircularProgressBarViewModel.Attach>
                                <local:CircularProgressBarViewModel HoleSizeFactor="0.75" />
                            </local:CircularProgressBarViewModel.Attach>


                            <Ellipse Width="{Binding Diameter}"
                                     Height="{Binding Diameter}"
                                     HorizontalAlignment="Center" VerticalAlignment="Center"
                                     Fill="Transparent" Stroke="LightGray"
                                     StrokeThickness="0.3" />

                            <local:PiePiece CentreX="{Binding CentreX}"
                                            CentreY="{Binding CentreY}"
                                            Fill="LightBlue"
                                            Radius="{Binding Radius}"
                                            RotationAngle="0"
                                            WedgeAngle="{Binding Angle}" />

                            <Grid local:GridUtils.ColumnDefinitions="*,3.5*,*" local:GridUtils.RowDefinitions="*,3.5*,*">
                                <TextBlock Grid.Row="1" Grid.Column="1"
                                           HorizontalAlignment="Center" VerticalAlignment="Center"
                                           FontSize="20" FontWeight="Bold"
                                           Foreground="DarkBlue"
                                           Text="{Binding Percent,
                                                          StringFormat=0%}" />
                            </Grid>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="SegmentedProgressBarStyle" TargetType="ProgressBar">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ProgressBar">
                        <Grid x:Name="LayoutRoot">
                            <!--  attach the view model  -->
                            <local:CircularProgressBarViewModel.Attach>
                                <local:SegmentedProgressBarViewModel HoleSizeFactor="0.7" />
                            </local:CircularProgressBarViewModel.Attach>

                            <!--  render the segments  -->
                            <ItemsControl ItemsSource="{Binding Segments}">
                                <ItemsControl.ItemsPanel>
                                    <ItemsPanelTemplate>
                                        <Grid />
                                    </ItemsPanelTemplate>
                                </ItemsControl.ItemsPanel>
                                <ItemsControl.ItemTemplate>
                                    <DataTemplate>
                                        <Grid>
                                            <!--  a grey segment  -->
                                            <local:PiePiece CentreX="{Binding Parent.CentreX}"
                                                            CentreY="{Binding Parent.CentreY}"
                                                            Fill="LightGray"
                                                            InnerRadius="{Binding Parent.InnerRadius}"
                                                            Opacity="0.5"
                                                            Radius="{Binding Parent.Radius}"
                                                            RotationAngle="{Binding StartAngle}"
                                                            Stroke="White"
                                                            WedgeAngle="{Binding WedgeAngle}" />
                                            <!--  a blue segment, with an Opacity bound to the view model  -->
                                            <local:PiePiece CentreX="{Binding Parent.CentreX}"
                                                            CentreY="{Binding Parent.CentreY}"
                                                            Fill="DarkBlue"
                                                            InnerRadius="{Binding Parent.InnerRadius}"
                                                            Opacity="{Binding Opacity}"
                                                            Radius="{Binding Parent.Radius}"
                                                            RotationAngle="{Binding StartAngle}"
                                                            Stroke="White"
                                                            WedgeAngle="{Binding WedgeAngle}" />
                                        </Grid>
                                    </DataTemplate>
                                </ItemsControl.ItemTemplate>
                            </ItemsControl>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="PointsProgressBarStyle" TargetType="ProgressBar">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ProgressBar">
                        <Grid x:Name="LayoutRoot">
                            <!--  attach the view model  -->
                            <local:CircularProgressBarViewModel.Attach>
                                <local:SegmentedProgressBarViewModel HoleSizeFactor="0.8" SegmentCount="14" />
                            </local:CircularProgressBarViewModel.Attach>

                            <Canvas>
                                <ItemsControl Canvas.Left="{Binding CentreX}"
                                              Canvas.Top="{Binding CentreY}"
                                              ItemsSource="{Binding Segments}">
                                    <ItemsControl.ItemsPanel>
                                        <ItemsPanelTemplate>
                                            <Canvas />
                                        </ItemsPanelTemplate>
                                    </ItemsControl.ItemsPanel>
                                    <ItemsControl.ItemTemplate>
                                        <DataTemplate>
                                            <Ellipse Width="9" Height="9"
                                                     Fill="DarkBlue">
                                                <Ellipse.RenderTransform>
                                                    <TransformGroup>
                                                        <TranslateTransform X="-4" Y="-4" />
                                                        <ScaleTransform ScaleX="{Binding Opacity}" ScaleY="{Binding Opacity}" />
                                                        <TranslateTransform Y="{Binding Parent.InnerRadius}" />
                                                        <RotateTransform Angle="180" />
                                                        <RotateTransform Angle="{Binding StartAngle}" />
                                                    </TransformGroup>
                                                </Ellipse.RenderTransform>
                                            </Ellipse>
                                        </DataTemplate>
                                    </ItemsControl.ItemTemplate>
                                </ItemsControl>
                            </Canvas>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>
    <Grid x:Name="LayoutRoot" 
          Background="Transparent">

        <!--<ProgressBar Value="{Binding Value}" 
                 Width="80" Height="80" 
                 Style="{StaticResource GlassyProgressBarStyle}" />-->

        <!--<ProgressBar Value="{Binding Value}" 
                 Grid.Column="1"
                 Width="100" Height="20"  />

        <ProgressBar Value="{Binding Value}" 
                 Width="80" Height="80" 
                 Grid.Row="1"
                 Style="{StaticResource CircularProgressBarStyle}" />-->

        <ProgressBar x:Name="CirProgressIndicator" Value="{Binding Value}" 
                 Width="80" Height="80" 
                 Grid.Row="1" Grid.Column="1"
                 Style="{StaticResource SegmentedProgressBarStyle}" />

        <!--<ProgressBar Value="{Binding Value}" 
                 Width="80" Height="80" 
                 Grid.Column="2"
                 Style="{StaticResource PieProgressBarStyle}" />

        <ProgressBar Value="{Binding Value}" 
                 Width="80" Height="80" 
                 Grid.Column="2" Grid.Row="1"
                 Style="{StaticResource PointsProgressBarStyle}" />

        <CheckBox Content="Pause" Grid.Column="3" VerticalAlignment="Center"
              HorizontalAlignment="Right" Margin="10"
              x:Name="pauseButton"/>-->
    </Grid>
</UserControl>
